import { generateID } from "./utils";

export default class EPGItem {
  /**
   * 当前 EPGItem 的 DOM 元素
   */
  el = undefined;
  /**
   * 当前元素是否未默认选择的元素
   */
  isDefault = false;
  /**
   * 是否为当前焦点
   */
  isFocus = false;
  /**
   * 当前元素的唯一 ID
   */
  id = generateID();
  /**
   * 返回当前 EPGItem 的 HTMLElement 的 getBoundingClientRect
   */
  getRect() {
    return this.el?.getBoundingClientRect();
  }
  /**
   * 当前元素的所有监听器函数
   */
  events = {
    click: null,
    focus: null,
    blur: null,
    left: null,
    right: null,
    up: null,
    down: null,
    enter: null,
  };
  focusClass = undefined;
  constructor(vnode, binding) {
    this.el = vnode.el;

    if (this.el.dataset.epgItemId) {
      this.id = this.el.dataset.epgItemId;
    } else {
      this.el.dataset.epgItemId = this.id;
    }
    this.isDefault = !!(binding.value && binding.value.default);
    this.isFocus = false;
    // 将binding中的default、value等信息进行赋值
    if (binding.value && binding.value.class) {
      binding.value.class && (this.focusClass = binding.value.class);
    }
    if (vnode.props?.onUp) {
      this.events.up = vnode.props.onUp;
    }
    if (vnode.props?.onDown) {
      this.events.down = vnode.props.onDown;
    }
    if (vnode.props?.onLeft) {
      this.events.left = vnode.props.onLeft;
    }
    if (vnode.props?.onRight) {
      this.events.right = vnode.props.onRight;
    }
    if (vnode.props?.onBlur) {
      this.events.blur = vnode.props.onBlur;
    }
    if (vnode.props?.onFocus) {
      this.events.focus = vnode.props.onFocus;
    }
    if (vnode.props?.onClick) {
      this.events.click = vnode.props.onClick;
    }
    if (vnode.props?.onEnter) {
      this.events.click = vnode.props.onEnter;
    }
  }
}
